// 基于axios进行封装

// 引入axios
import axios from 'axios'
// 引入Vuex
import store from '@/store'
// 引入路由
import router from '@/router'
import { message } from '@/components/Message/index.js'

// 实例化
// 1. baseURL
// 2. 超时时间
// 3. 大数处理
const instance = axios.create({
  baseURL: 'http://pcapi-xiaotuxian-front-devtest.itheima.net/', // 接口根地址
  timeout: 5000 // 最大超时时间  发送一个请求,如果超过5秒还没有响应,就取消
})

// 拦截器
// 1. 请求拦截器  全局注入token
instance.interceptors.request.use((config) => {
  // 在发送请求之前做些什么
  //  从store中 拿到当前用户token 放到headers里面 全局注入token
  //   1. 拿到token
  const token = store.state.user.profile.token
  // 2. 在请求头中全局注入token
  if (token) { // 如果有token
    config.headers.Authorization = `Bearer ${token}`
  }
  return config
}, (error) => {
  // 对请求错误做些什么
  return Promise.reject(error)
})

// 2. 响应拦截器
//    1. token失效  401  跳转登录页
//    2. 当后端接口返回的状态不是以http状态码 200-300返回   而是通过自定义字段展示一个接口的成功状态
//        如:  返回一个success字段  当success为true的时候,代表接口请求成功,是OK的
//          看人资视频
instance.interceptors.response.use((response) => {
  // 对响应数据做点什么  状态码是 200-300
  return response
}, (e) => {
  message({ type: 'error', text: e.response.data.message })
  // 对响应错误做点什么 状态码除了200-300
  // 如果是401 代表token失效  跳转到登录页
  if (e.response && e.response.status === 401) {
    const redirectUrl = encodeURIComponent(router.currentRoute.value.fullPath)
    router.push('/login?redirectUrl=' + redirectUrl)
  }
  return Promise.reject(e)
})

// 封装一个通用的函数 可以帮助用户解决掉get和post传参的形式
// axios get -> params    axios post -> data
// 请求函数
function request (url, method, reqData) {
  return instance({ // 相当于调用了axios
    url,
    method,
    [method.toLowerCase() === 'get' ? 'params' : 'data']: reqData
  })
}
export default request
